<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
<style>
		*{
			margin: 0;
			padding: 0;
		}
		.content{
			width: 1150px;
			margin:20px auto;
			border: 1px solid #cccccc;
			padding: 20px;
		}
		.title1 p{
			font-size: 20px;
		}
		.sel{
			height: 160px;
		}
		.sel label{
			display: block;
			margin:10px 0;
		}
		.daan span{
			font-size: 20px;
			padding:5px 8px;
			color:green;
			background: lightgreen;
			/*border: 1px solid green;*/
			border-radius: 4px;
		}
		.daan span.w{
			background: #FCBABC;
			color:#FC3A00;
		}
		.fenye{
			margin:20px;
		}
		.fenye a{
			display: inline-block;
			width: 123px;
			height: 47px;
			background: #56B04B;
			text-decoration: none;
			color:#ffffff;
			font-size: 20px;
			line-height: 47px;
			text-align: center;
			border-radius: 5px;
		}
		.tongji{
			padding:20px 0;
			border: 1px solid #cccccc;
		}
		.snav{
			width: 1150px;
			margin:10px auto 0;
		}
		.snav a{
			text-decoration: none;
			color:#333333;
		}
	</style>
</head>
<body>
	<div class="snav">
		<a href="login.html" id="loginBtn">请登录</a>
		<a href="regester.html" id="regBtn">请注册</a>
	</div>
	<div class="content">
		<div class="title1">
			<!-- <p>1.机动车驾驶人造成事故后逃逸构成犯罪的，吊销驾驶证且多长时间不得重新取得驾驶证？</p> -->
		</div>
		<div class="sel">
			<!-- <label for=""><input type="radio" name="sel" value="1"> A：5年内</label>
			<label for=""><input type="radio" name="sel" value="2"> B: 10</label>
			<label for=""><input type="radio" name="sel" value="3"> C：5年内</label>
			<label for=""><input type="radio" name="sel" value="4"> D: 10</label> -->
		</div>
		<div class="daan">
			<!-- <span>恭喜你对了</span> -->
		</div>
		<div class="fenye">
			<a href="javascript:;" id="prevBtn">上一题</a>
			<a href="javascript:;" id="nextBtn">下一题</a>
			<a href="javascript:;">本题解释</a>
		</div>
		<div class="tongji">
			<p>已答：<span class="zong">0</span>正确：<span class="right">0</span>错误：<span class="wrong">0</span>正确率：<span class="lv">0.00%</span></p>
		</div>
	</div>
</body>
<script src="../jquery-1.10.1.min.js"></script>
<script src="cookie.js"></script>
<script>
	// 获取uname 的cookie值
	var uname = getCookie('uname');
	if(uname){
		$("#loginBtn").html(uname).attr('href','javascript:;');
	}else{
		
		var nowpage = 1;
		
		// 通过sessionStorage存储数据
		// 先获取本地数据，看是否存在
		var data = sessionStorage.getItem('info');
		if(data){
			// 需要解析，使用
			data = JSON.parse(data);
			if(data.page==1){
				nowpage =data.page;
			}else{
				//出现提示窗口
				var yesorno = confirm('您上次答道'+data.page+'题了，是否继续')
				if(yesorno){
					nowpage = data.page;
					creatpage(nowpage);
				}else{
					nowpage = 1;
					creatpage(nowpage);
				}
			}
			
			
			
			
		}else{
			// 没有这个数据呢，需要创建
			data= {'page':1,		
			'count':{		
				'zong':0,	
				'right':0,	
				'wrong':0,	
				'lv':'0.00%'	
			},'yida':{	
			}}
		}
	    creatpage(nowpage);
		function creatpage(nowpage){
			
			// 请求信息：
			$.post('getdata.php',{page:nowpage},function(result){
				result = JSON.parse(result);
				$('.sel').empty();
				$('.daan').empty();
				$(".title1").html('<p>'+result.id+' '+result.question+'</p>');
				if(result.Type == 2){
					$('<label for=""><input type="radio" name="sel" value="1"> A:'+result.a+'</label><label for=""><input type="radio" name="sel" value="2"> B:'+result.b+'</label><label for=""><input type="radio" name="sel" value="3"> C:'+result.c+'</label><label for=""><input type="radio" name="sel" value="4"> D:'+result.d+'</label>').appendTo('.sel');
				}else{
					$('<label for=""><input type="radio" name="sel" value="1">正确</label><label for=""><input type="radio" name="sel" value="2">错误</label>').appendTo('.sel')
				}
	
				// 显示统计数据
				$(".zong").html(data.count.zong);
				$(".right").html(data.count.right);
				$(".wrong").html(data.count.wrong);
				$(".lv").html(data.count.lv);
				
				//答题
				$('.sel input').click(function(){
					data.count.zong++;
					$('.sel input').attr('disabled','disabled');
					var check1 = $(this).val();
					if(check1 == result.ta){
						data.count.right++;
						$('<span>答对了</span>').appendTo('.daan')
					}else{
						data.count.wrong++;
						if(result.Type==2){
							var arr = ['','A','B','C','D'];
						}else{
							var arr = ['','正确','错误'];
						}
						console.log(result.ta)
						$('<span class="w">打错了,整错答案是：'+arr[result.ta]+'</span>').appendTo('.daan');
						
					}
					data.count.lv = (data.count.right/data.count.zong*100).toFixed(2)+'%';
					
						// 显示统计数据
					$(".zong").html(data.count.zong);
					$(".right").html(data.count.right);
					$(".wrong").html(data.count.wrong);
					$(".lv").html(data.count.lv);
					
					
					//存储到sessionStorage中，
					sessionStorage.setItem('info',JSON.stringify(data));
				})
					
				
			})
			//更新页码
			data.page = nowpage;
			
			
			
			
			//存储到sessionStorage中，
			sessionStorage.setItem('info',JSON.stringify(data));
		}
		
	//上一题     下一题
	$('#nextBtn').click(function(){
		nowpage++;
		if(nowpage>50){
			nowpage = 50;
			return;
		}
		creatpage(nowpage);
	})
	
	$('#prevBtn').click(function(){
		nowpage--;
		if(nowpage<1){
			nowpage = 1;
			return;
		}
		creatpage(nowpage);
	})
	
	
	
	
	
	
	}

</script>
</html>